<template>
  <a-modal
    v-model:visible="visible"
    title="添加客户"
    :ok-loading="modalProps.loading"
    @before-ok="submit"
  >
    <a-form ref="formRef" :model="form">
      <a-form-item field="accountManager" label="客户经理">
        <!-- <a-input v-model="form.accountManager" placeholder="客户经理" /> -->
        <a-select>
          <a-option
            v-for="manager in managers"
            :key="manager.userId"
            :label="manager.userName"
            :value="manager.userId"
          />
        </a-select>
      </a-form-item>
      <a-form-item field="amountAlreadyAdvanced" label="已经垫付金额">
        <a-input-number v-model="form.amountAlreadyAdvanced" placeholder="已经垫付金额" :min="0">
          <template #prefix> ¥ </template>
        </a-input-number>
      </a-form-item>
      <a-form-item field="customerAvailableAmount" label="客户可用金额">
        <a-input-number v-model="form.customerAvailableAmount" placeholder="客户可用金额" :min="0">
          <template #prefix> ¥ </template>
        </a-input-number>
      </a-form-item>
      <a-form-item field="customerName" label="	客户名称">
        <a-input v-model="form.customerName" placeholder="客户名称" />
      </a-form-item>
      <a-form-item field="customerTiktokId" label="客户抖音ID">
        <a-input v-model="form.customerTiktokId" placeholder="客户抖音ID" />
      </a-form-item>
      <a-form-item field="policyPoints" label="客户政策点位">
        <a-input-number
          v-model="form.policyPoints"
          placeholder="客户政策点位"
          :min="0"
          :max="100"
          :step="1"
        >
          <template #suffix> % </template>
        </a-input-number>
      </a-form-item>
      <a-form-item field="remarks" label="备注">
        <a-input v-model="form.remarks" placeholder="备注" />
      </a-form-item>
      <a-form-item field="tiktokAvailableAmount" label="抖音可用金额">
        <a-input-number v-model="form.tiktokAvailableAmount" placeholder="抖音可用金额" :min="0">
          <template #suffix> ¥ </template>
        </a-input-number>
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script setup lang="ts" name="AddClient">
  import { Customer } from '@/api/customer/type'
  import { useAddClient } from './AddClient.hook'

  const emits = defineEmits<{
    doRefresh: []
  }>()

  const visible = defineModel<boolean>('visible')
  const customer = defineModel<Customer>('customer')

  const { modalProps, managers, form, formRef, submit } = useAddClient(undefined, emits, {
    visible,
    customer,
  })
</script>
